<script setup>
import {RouterView} from 'vue-router'
import {useThemeStore} from '@/stores/theme'
import {zhCn} from "element-plus/es/locale/index";

const themeStore = useThemeStore()
</script>

<template>
  <div :class="{ 'dark-theme': themeStore.isDark }">
    <el-config-provider :locale="zhCn">
      <RouterView/>
    </el-config-provider>
  </div>
</template>

<style>
.dark-theme {
  --el-bg-color: #1f2937;
  --el-bg-color-page: #111827;
  --el-text-color-primary: #f3f4f6;
  --el-text-color-regular: #d1d5db;
  --el-text-color-secondary: #9ca3af;
  --el-border-color-light: #374151;
  --el-border-color: #4b5563;
  --el-border-color-darker: #6b7280;
  --el-fill-color-light: #374151;
  --el-fill-color: #4b5563;
  --el-fill-color-dark: #6b7280;
  color-scheme: dark;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
}

#app {
  height: 100%;
  width: 100%;
}
</style>
